<template>
  <div>
    <!-- <LifeCyclesVue :msg="msg" v-if="show" /> -->
    <!-- <Ref /> -->
    <Watch />

    <button @click="change1">change1</button>
    <button @click="change2">change2</button>
  </div>
</template>

<script>
import LifeCyclesVue from './components/LifeCycles.vue'
import Ref from './components/Ref.vue'
import Watch from './components/Watch.vue'

export default {
  name: 'App',
  components: {
    LifeCyclesVue,
    Ref,
    Watch,
  },
  data() {
    return {
      msg: '生命周期',
      show: true
    }
  },
  methods: {
    change1() {
      this.msg = '触发更新两个生命周期钩子' + Date.now()
    },
    change2() {
      this.msg = '触发销毁两个生命周期钩子'
      this.show = !this.show
    },
  }
}
</script>
